// import 'package:flutter/material.dart';
// import 'package:flutter_form_builder/flutter_form_builder.dart';
// import 'package:graphview/GraphView.dart' as GF;
// import 'package:ichinesereader/constants.dart';
// import 'package:ichinesereader/controller/cache.dart';
// import 'package:ichinesereader/controller/evaluation.dart';
// import 'package:ichinesereader/models/common/LevelOption.dart';
// import 'package:ichinesereader/models/evaluation/evaluationSkillType.dart';
// import 'package:ichinesereader/models/evaluation/proficiencySkillsResult.dart';
// import 'package:ichinesereader/pages/common/circularImage.dart';
// import 'package:ichinesereader/utils/helper.dart';
// import 'package:ichinesereader/widgets/grids/evaluationProficiencySkillProgressDataGrid.dart';
// import 'package:syncfusion_flutter_gauges/gauges.dart';
// import 'package:get/get.dart';
// import 'package:ichinesereader/utils/log.dart';
// import 'package:hive_flutter/hive_flutter.dart';
// import '../../themes/appTheme.dart';

// class EvaluationProficiencySkillsTreeGraph extends StatefulWidget {
//   EvaluationProficiencySkillsTreeGraph({Key? key}) : super(key: key);

//   @override
//   EvaluationProficiencySkillsTreeGraphState createState() =>
//       EvaluationProficiencySkillsTreeGraphState();
// }

// class EvaluationProficiencySkillsTreeGraphState
//     extends State<EvaluationProficiencySkillsTreeGraph> {
//   final EvaluationController controller = Get.find();
//   final box = Hive.box('appconfig');
//   final GF.BuchheimWalkerConfiguration builder =
//       GF.BuchheimWalkerConfiguration();
//   var graph = GF.Graph()..isTree = true;
//   late List<ProficiencySkillsDataTree> _evaluationSkillsDataTree;
//   String _skillType = Constants.evaluationSkillTypes[0].skill.toString();
//   String _classId = '';
//   bool isTeacher = false;
//   int _currentLevel = 1;

//   @override
//   void initState() {
//     builder
//       ..siblingSeparation = (20)
//       ..levelSeparation = (20)
//       ..subtreeSeparation = (20)
//       ..orientation = (GF.BuchheimWalkerConfiguration.ORIENTATION_LEFT_RIGHT);

//     isTeacher = box.get(CacheManagerKey['nanhairole'].toString()) ==
//         Constants.NanhaiRole_Teacher;

//     if (isTeacher) {
//       _classId = box.get(CacheManagerKey['currentclass'].toString());
//     } else {
//       _classId = '';
//     }

//     try {
//       if (isTeacher) {
//         _currentLevel =
//             (box.get(CacheManagerKey['eveluationlevel'].toString()) as double)
//                 .toInt();
//       } else {
//         _currentLevel = int.tryParse(
//                 box.get("UserLevel").toString().replaceAll('level', '')) ??
//             1;
//       }
//     } catch (error) {
//       _currentLevel = 1;
//     }

//     Future.delayed(Duration(milliseconds: 200), () {
//       controller.fetchEvaluationProficiencySkillsData(
//           _classId, _currentLevel.toString(), '');
//     });

//     super.initState();
//   }

//   @override
//   void dispose() {
//     super.dispose();
//   }

//   void setSkillType(String type) {
//     setState(() {
//       _skillType = type;
//     });
//   }

//   void _buildGraph(String type) {
//     graph = GF.Graph()..isTree = true;
//     try {
//       ProficiencySkillsDataTree rootTree = this
//           ._evaluationSkillsDataTree
//           .where((tree) => tree.name == type)
//           .first;
//       final rootNode = GF.Node.Id(rootTree);
//       if (rootTree.skills!.isNotEmpty) {
//         rootTree.skills?.forEach((elementTree) {
//           var subNode = GF.Node.Id(elementTree);
//           graph.addEdge(rootNode, subNode);
//           if (elementTree.skills!.isNotEmpty) {
//             elementTree.skills?.forEach((elementSubTree) {
//               var subItemNode = GF.Node.Id(elementSubTree);
//               graph.addEdge(subNode, subItemNode);
//             });
//           }
//         });
//       }
//     } catch (error) {
//       graph = GF.Graph()..isTree = true;
//       Log.debug('teacher/student evaluation skills graph: $error');
//     }
//   }

//   buildFloatingActionButtons() {
//     List<EvaluationSkillType> skillTypes = Constants.evaluationSkillTypes
//         .where((element) => element.skill != 'AI Speaking')
//         .toList();

//     return Column(
//       mainAxisAlignment: MainAxisAlignment.center,
//       children: skillTypes
//           .map((state) => Padding(
//                 padding: const EdgeInsets.only(bottom: 8.0),
//                 child: SizedBox(
//                   width: 45.0,
//                   height: 45.0,
//                   child: FloatingActionButton(
//                       heroTag: state.skill.toString(),
//                       tooltip: state.skill!.tr,
//                       onPressed: () {
//                         setSkillType(state.skill.toString());
//                       },
//                       elevation: 5,
//                       splashColor: Colors.grey,
//                       child: Image.asset(
//                         state.image.toString(),
//                         width: 50,
//                         height: 50,
//                       )),
//                 ),
//               ))
//           .toList(),
//     );
//   }

//   @override
//   Widget build(BuildContext context) {
//     box.put('SkillType', 'Proficient');
//     Log.debug(
//         'Build evaluation proficiency skills treeview teacher/student graph');
//     return Scaffold(
//       backgroundColor: Colors.transparent,
//       floatingActionButton: buildFloatingActionButtons(),
//       floatingActionButtonLocation: FloatingActionButtonLocation.miniEndTop,
//       body: Column(
//         mainAxisSize: MainAxisSize.max,
//         crossAxisAlignment: CrossAxisAlignment.start,
//         children: [
//           //////////////椭圆形级数选项/////////
//           Wrap(
//             alignment: WrapAlignment.start,
//             crossAxisAlignment: WrapCrossAlignment.center,
//             children: [
//               Container(
//                 padding: const EdgeInsets.only(left: 15.0),
//                 decoration: BoxDecoration(
//                     borderRadius: BorderRadius.circular(3.0),
//                     color: Get.isDarkMode
//                         ? AppTheme.colors.darkTheme2
//                         : Colors.white.withOpacity(0.3)),
//                 margin: EdgeInsets.only(bottom: 9.0),
//                 child: FormBuilderChoiceChip(
//                   spacing: 3.0,
//                   labelPadding: EdgeInsets.symmetric(
//                     horizontal: 12.0,
//                   ),
//                   alignment: WrapAlignment.start,
//                   selectedColor: Get.isDarkMode
//                       ? Colors.white
//                       : Get.theme.primaryColorDark.withOpacity(0.9),
//                   backgroundColor: Colors.transparent,
//                   initialValue: Constants.levelEvaluationOptions
//                       .where((element) =>
//                           element.value.toString().replaceAll('level', '') ==
//                           _currentLevel.toString())
//                       .first,
//                   elevation: 3,
//                   decoration: InputDecoration(
//                     // labelText: 'Levels',
//                     labelStyle: Get.theme.textTheme.labelSmall,
//                     border: InputBorder.none,
//                   ),
//                   name: 'level_filter_chip',
//                   onChanged: (value) {
//                     if (value == null) return;
//                     var item = value as LevelOption;
//                     controller.fetchEvaluationProficiencySkillsData(_classId,
//                         item.value.toString().replaceAll('level', ''), '');
//                     _currentLevel = int.parse(
//                         item.value.toString().replaceAll('level', ''));
//                   },
//                   options: Constants.levelEvaluationOptions
//                       .map((level) => FormBuilderChipOption<LevelOption>(
//                             value: level,
//                             child: Text(
//                               level.label
//                                   .toString()
//                                   .replaceAll('Level 0', 'N/A')
//                                   .replaceAll('Level ', ''),
//                               style: TextStyle(
//                                 fontSize: 15,
//                                 fontWeight: FontWeight.bold,
//                                 color:
//                                     hexStringToHexInt(level.color.toString()),
//                                 letterSpacing: 0,
//                               ),
//                             ),
//                           ))
//                       .toList(),
//                 ),
//               ),
//               // Container(
//               //   width: 250,
//               //   child: FormBuilderChoiceChip(
//               //     decoration: InputDecoration.collapsed(
//               //       hintText: '',
//               //       border: InputBorder.none,
//               //     ),
//               //     labelStyle: TextStyle(
//               //       color: Theme.of(context).primaryColorLight,
//               //       fontSize: 15,
//               //       letterSpacing: 0.8,
//               //     ),
//               //     selectedColor: Get.isDarkMode
//               //         ? (Colors.white)
//               //         : Theme.of(context).primaryColorDark,
//               //     name: 'evaluation_skill_types',
//               //     onChanged: (value) {
//               //       if (value == null) return;
//               //       var skillType = value as EvaluationSkillType;
//               //       setState(() {
//               //         _skillType = skillType.skill.toString();
//               //       });
//               //     },
//               //     initialValue: Constants.evaluationSkillTypes[0],
//               //     options: Constants.evaluationSkillTypes
//               //         .where((element) => element.skill != 'AI Speaking')
//               //         .map(
//               //             (state) => FormBuilderChipOption<EvaluationSkillType>(
//               //                 value: state,
//               //                 child: Image.asset(
//               //                   state.image.toString(),
//               //                   width: 36,
//               //                   height: 36,
//               //                 )))
//               //         .toList(),
//               //   ),
//               // ),
//             ],
//           ),
//           ///////树状图的背景//////
//           Expanded(
//             child: Container(
//               decoration: BoxDecoration(
//                 borderRadius: BorderRadius.circular(3.0),
//                 color: Get.isDarkMode
//                     ? AppTheme.colors.darkTheme2
//                     : Colors.white.withOpacity(0.3),
//               ),
//               padding: EdgeInsets.only(
//                 top: 45.0,
//                 right: 12.0,
//               ),
//               child: controller.obx(
//                 (data) {
//                   _evaluationSkillsDataTree =
//                       controller.evaluationSkillsDataTree;
//                   if (_evaluationSkillsDataTree.isNotEmpty) {
//                     _buildGraph(_skillType);
//                   }
//                   if (graph.nodes.isNotEmpty) {
//                     return InteractiveViewer(
//                         constrained: false,
//                         boundaryMargin: EdgeInsets.all(100),
//                         minScale: 0.01,
//                         maxScale: 2.5,
//                         scaleEnabled: false,
//                         panEnabled: true,
//                         child: GF.GraphView(
//                           graph: graph,
//                           animated: true,
//                           algorithm: GF.BuchheimWalkerAlgorithm(
//                               builder, GF.TreeEdgeRenderer(builder)),
//                           paint: Paint()
//                             ..color = Colors.teal
//                             ..strokeWidth = 1
//                             ..style = PaintingStyle.stroke,
//                           builder: (GF.Node node) {
//                             var a =
//                                 node.key!.value as ProficiencySkillsDataTree?;
//                             return rectangleWidget(a);
//                           },
//                         ));
//                   } else {
//                     Log.debug('graph null error');
//                     return Text('');
//                   }
//                 },
//                 onEmpty: Center(child: Text('Data not available ...'.tr)),
//                 // onLoading: Center(
//                 //     child: CircularProgressIndicator(
//                 //   backgroundColor: Get.theme.primaryColorDark,
//                 //   strokeWidth: 9.0,
//                 // )),
//               ),
//             ),
//           )
//         ],
//       ),
//     );
//   }

//   Widget rectangleWidget(dynamic node) {
//     ProficiencySkillsDataTree tree = node as ProficiencySkillsDataTree;
//     double _percentage = tree.progress != 0 && tree.total != 0
//         ? (tree.progress! / tree.total!) * 100
//         : 0;

//     String image =
//         'https://resources.ichinesereader.com/media/evaluation/bubble_blue_${tree.progress}.gif';
//     return InkWell(
//       onTap: () {
//         Log.debug(tree.id);
//         if (isTeacher) {
//           // Get.to(() => EvaluationProficiencySkillProgressTreeMap(
//           //       level: _currentLevel.toString(),
//           //       skillId: tree.id.toString(),
//           //       skillTitle: tree.name.toString(),
//           //     ));
//           Get.to(() => EvaluationProficiencySkillProgressDataGrid(
//                 level: _currentLevel.toString(),
//                 skillId: tree.id.toString(),
//                 skillTitle: tree.name.toString(),
//               ));
//         }
//       },
//       ////////单个技能选项方块////////
//       child: Container(
//           margin: EdgeInsets.all(12.0),
//           padding: EdgeInsets.all(30),
//           decoration: BoxDecoration(
//             color:
//                 Get.isDarkMode ? Colors.black : Colors.white.withOpacity(0.5),
//             borderRadius: BorderRadius.circular(12.0),
//             boxShadow: [
//               BoxShadow(
//                 blurRadius: 9.0,
//                 spreadRadius: 1.0,
//                 color: Get.isDarkMode
//                     ? Colors.transparent
//                     : Get.theme.primaryColor.withOpacity(0.3),
//                 offset: Offset(12.0, 12.0),
//               ),
//             ],
//           ),
//           child: Row(
//             children: [
//               Container(
//                 width: 60,
//                 height: 60,
//                 child: SfRadialGauge(
//                   axes: [
//                     RadialAxis(
//                         minimum: 0,
//                         maximum: 100,
//                         startAngle: 0,
//                         endAngle: 360,
//                         interval: 1,
//                         showTicks: false,
//                         showLabels: false,
//                         axisLineStyle: AxisLineStyle(thickness: 6),
//                         pointers: <GaugePointer>[
//                           RangePointer(
//                               value: _percentage,
//                               width: 6,
//                               color: Colors.tealAccent[200],
//                               cornerStyle: CornerStyle.bothCurve)
//                         ],
//                         showFirstLabel: false,
//                         annotations: <GaugeAnnotation>[
//                           GaugeAnnotation(
//                               widget: NonCacheCircularImage(image, 60),
//                               angle: 50,
//                               positionFactor: 0)
//                         ])
//                   ],
//                 ),
//               ),
//               SizedBox(
//                 width: 9.0,
//               ),
//               Text(tree.name.toString(),
//                   style: TextStyle(
//                     color: Get.isDarkMode
//                         ? Get.theme.primaryColorDark
//                         : Colors.black,
//                   )),
//             ],
//           )),
//     );
//   }
// }
